
<%@ include file="/inc/header.jsp" %>      

<c:url var="rootUrl" value="/spring/matieres" />

<span class="titrePage"><spring:message code="entity.Competence"/></span>
      <br/>
		<script>
		<!--

			$(document).ready(function() {
			   $('#competenceForm').ajaxForm({
			      type: 'POST',
			      url: 'ajax/show',
			      target: '#results'
			   });
			   $('#idCategorie').bind('change', loadMatieres);
			});

	       // When a 'idCategorie' option is selected, populate the 'idMatiere' dropdown
	       function loadMatieres(e) {
		       alert(this.value);
		      if (this.value == '') {
		    	  $('#idMatiere').html('<option value="">...</option>');
		      } else {
			      $.getJSON(
					 "${rootUrl}/category/"+ this.value +"/list",     // url
				     function(json){           // callback
				    	//alert(json['list'][0]['matiere'][0]['id']);
				        var options = '<option value="">...</option>';
				        //$(json['list'][0]['matiere']).each(function() {
				        $(json).each(function() {
					        //alert(this);
				            options += '<option value="' + this.id + '">' + this.nom + '</option>';
				        });
				        $('#idMatiere').html(options);
				     }
				  );
			 }
	       }		

		-->
		</script>
      <blockquote>
	<common:messages />

      	<div class="formLayout">
      	<form:form modelAttribute="competenceForm" action="show" method="POST">
      	<fieldset>
			<legend><spring:message code="title.search"/></legend>
			<form:hidden path="id" />

			<label for="idCategorie"><spring:message code="field.categorie" /></label>
			<form:select path="idCategorie">
				<form:option label="..." value="" />
				<form:options items="${categories}" itemValue="id" itemLabel="nom" />
			</form:select> <br />

			<label for="idMatiere"><spring:message code="field.matiere" /></label>
			<form:select path="idMatiere">
				<form:option label="..." value="" />
				<form:options items="${matieres}" itemValue="id" itemLabel="nom" />
			</form:select> <br />

			<label for="nom"><spring:message code="field.nom" /></label>
			<form:textarea path="nom" rows="3" cols="50" /> <br />

            <div class="buttonBar" align="center">
            	<input value="<spring:message code="button.search"/>" type="submit" />
            </div>
         </fieldset>
         </form:form>
        </div>
      </blockquote>
         <p>&nbsp;</p>
      <span class="titrePage">
         <spring:message code="libelle.titreaddresultsearch"/>
      </span>
      <br/><br/>
      	<div id="log"></div>
		<div id="results">
			<%@ include file="results.jsp" %>
		</div>
      <br/>
      <br/>
      <a href="javascript:history.back()">
		<spring:message code="libelle.retour"/>
      </a>

<%@ include file="/inc/footer.jsp" %>
